@charset "utf-8";
@import "reset";
html{
    font-size: 40px;
      }
$fontSize:40;
@function r($p){
    @return $p/$fontSize*1rem;
}
$allWidth:1920;
@function w($Width){
    @return $Width/$allWidth*100%;
}
body{
    font-size: 16px;
}
//pc banner
.index_banner{ 
   
    position: relative;
    >img{
       
    }
    >h5{
        text-align: center;
        a{
        font-size:54px;
        font-weight: 100;
        color: #636463;
        
        line-height: 3;
    }
    }
    .index_banner_local{
        position: absolute;
        top: 40%;
        left:40%;
        >p{
            font-size: 87px;
            color: white;
        }
        .index_banner_local_bottom{
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
            align-items: center;
            border: 1px solid white;
            width: 226px;
            height: 60px;
            margin: 0 auto;
            margin-top: 5%;
            >a{
                color: white;
                font-size: 18px;
            }
            >a:hover{
               font-size: 25px;
               color:#b27d71;
            }
        }
    }
}
//see more
.banner2{
    width: 75%;
    margin:0 auto;
    position: relative;
    >img{
        width: 100%;
    }
    >h5{
        text-align: center;
        a{
        font-size:54px;
        font-weight: 100;
        color: #636463;
        text-align: center;
        line-height: 3;
        }
    }
    .index_banner_local_bottom{
            position: absolute;
        top: 40%;
        left:41%;
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
            align-items: center;
            border: 1px solid white;
            width: 316px;
            height: 60px;
            margin: 0 auto;
            >a{
                color: white;
                font-size: 18px;
            }
            >a:hover{
               font-size: 25px;
               color:#b27d71;
            }
    }
}
//pc product   
.index_Product{
    width: 75%;
    margin: 0 auto;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    .index_Product_lf{
        text-align: center;
        width: 70%;
        >img{
            width: 100%;
            overflow: hidden;
        }
        >img:hover{
            transform: scale(1.05);
            
        }
        >h6{
            font-size: 21px;
            color: #636463;
            line-height: 3.5;
            font-weight: 100;
        }
        >p{
            font-size: 25px;
            color: black;
            font-weight:100;
        }
    }
    .index_Product_rt{
        margin-left: 5%;
        text-align: center;
        width: 33%;
        >img{
            width: 100%;
        }
        >img:hover{
            transform: scale(1.05);
            
        }
         >h6{
            font-size: 21px;
            color: #636463;
            line-height: 3.5;
            font-weight: 100;
        }
        >p{
            font-size: 25px;
            color: black;
            font-weight:100;
        }
    }
    .index_Product2_rt{
        margin-top: 3%;
        margin-left: 0%;
        margin-right: 5%;
        width:33%;
        >h6{
            line-height: 3.5;
        }
    }
    .index_Product2_lf{
        margin-top: 3%;
        width: 67%;
    }
}
//pc video
.index_video{
    width: 60%;
    margin: 0 auto;
    margin-top: 10%;
    text-align: center;
        >h6{
            font-size: 21px;
            color: #636463;
            line-height: 2.3;
            font-weight: 100;
        }
        >p{
            font-size: 25px;
            color: black;
            font-weight:100;
            margin-bottom: 5%;
        }
        .index_banner_local_bottom{
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
            align-items: center;
            border: 2px solid black;
            width: 316px;
            height: 60px;
            margin: 0 auto;
            margin-top: 5%;
            margin-bottom: 5%;
            >a{
                color: black;
                font-size: 18px;
            }
            >a:hover{
               font-size: 25px;
               color:#b27d71;
            }
    }
}
//footimg
.foot_img{
    position: relative;
   >p{
       position: absolute;
       top: 45%;
       left: 35%;
       font-size: 64px;
       color: white;
   }
   >img{
       width: 100%;
   }
   .foot_img_shadow{
       position: absolute;
       bottom: 0;
       background-color: #000000;
       opacity: 0.5;
       height: r(103);
       width: 100%;
       margin: 0 auto;
       .p_a{
           display: flex;
            display: -webkit-flex;
            width: 50%;
            margin: 0 auto;
            justify-content: space-between;
            padding-top: 2%;
            >p>a{
           color:white;
           font-size: r(10);
            }
           >a{
               color: white;
           }
       }
      
   }
}
//移动端
@media only screen and (max-width:768px){
// banner
.index_banner{ 
    position: relative;
    >img{
       
    }
    >h5{
        text-align: center;
        >a{
        font-size:r(54);
        font-weight: 100;
        color: #636463;
        text-align: center;
        line-height: 3;
        }
    }
    .index_banner_local{
        position: absolute;
        top: 40%;
        left:40%;
        >p{
            font-size: r(87);
            color: white;
        }
        .index_banner_local_bottom{
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
            align-items: center;
            border: 1px solid white;
            width: r(300);
            height: r(70);
            margin: 0 auto;
            margin-top: 5%;
            >a{
                color: white;
                font-size: r(18);
            }
            >a:hover{
               font-size: r(25);
               color:#b27d71;
            }
        }
    }
}
//see more
.banner2{
    width: 85%;
    margin:0 auto;
    position: relative;
    >img{
        width: 100%;
    }
   >h5{
        text-align: center;
        >a{
        font-size:r(54);
        font-weight: 100;
        color: #636463;
        text-align: center;
        line-height: 3;
        }
    }
    .index_banner_local_bottom{
            position: absolute;
        top: 35%;
        left:36%;
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
            align-items: center;
            border: 1px solid white;
            width: r(316);
            height: r(60);
            margin: 0 auto;
            margin-top: 0%;
            >a{
                color: white;
                font-size: r(18);
            }
            >a:hover{
               font-size: r(25);
               color:#b27d71;
            }
    }
}
// product   
.index_Product{
    width: 85%;
    margin: 0 auto;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    .index_Product_lf{
        text-align: center;
        >img{
            width: 100%;
        }
        >h6{
            font-size: r(13);
            color: #636463;
            line-height: 2;
            font-weight: 100;
        }
        >p{
            font-size: r(19);
            color: black;
            font-weight:100;
        }
    }
    .index_Product_rt{
        margin-left: 5%;
        text-align: center;
        >img{
            width: 100%;
        }
         >h6{
            font-size: r(13);
            color: #636463;
            line-height:2;
            font-weight: 100;
        }
        >p{
            font-size: r(19);
            color: black;
            font-weight:100;
        }
    }
    .index_Product2_rt{
        margin-top: 3%;
        margin-left: 0%;
        margin-right: 5%;
        >h6{
            line-height: 2.0;
        }
    }
    .index_Product2_lf{
        margin-top: 3%;
    }
}
// video
.index_video{
    width: 75%;
    margin: 0 auto;
    margin-top: 10%;
    text-align: center;
        >h6{
            font-size: r(13);
            color: #636463;
            line-height: 2.3;
            font-weight: 100;
        }
        >p{
            font-size: 19px;
            color: black;
            font-weight:100;
            margin-bottom: 5%;
        }
        .index_banner_local_bottom{
            display: flex;
            display: -webkit-flex;
            justify-content: space-around;
            align-items: center;
            border: 2px solid black;
            width: r(500);
            height: r(60);
            margin: 0 auto;
            margin-top: 5%;
            margin-bottom: 5%;
            >a{
                color: black;
                font-size: r(18);
            }
            >a:hover{
               font-size: r(25);
               color:#b27d71;
            }
    }
}

//footimg
.foot_img{
    width: 100%;
    position: relative;
   >p{
       position: absolute;
       top: 45%;
       left: 35%;
       font-size: r(64);
       color: white;
   }
   >img{
       width: 100%;
   }
   .foot_img_shadow{
       position: absolute;
       bottom: 5px;
       background-color: #000000;
       opacity: 0.5;
       height: 30px;
       width: 100%;
       margin: 0 auto;
       .p_a{
           display: flex;
            display: -webkit-flex;
            width: 90%;
            margin: 0 auto;
            justify-content: space-between;
            padding-top: 2%;
            align-items: center;
            
            >p{
           color:white;
           font-size:4px;
           
            }
           >a{
               color: white;
               font-size:4px;
           }
       }
      
   }
}

}